<template>
  <div class="login">
    <div class="close" @click="close()">
      <img src="../../../assets/image/user/close-ico.png" alt />
    </div>
    <h2 class="title">用户登录</h2>

    <div class="username inp">
      <input v-model="addData.phone" type="text" placeholder="用户名/手机号/邮箱" />
    </div>

    <div class="password inp">
      <input v-model="addData.password" type="password" placeholder="请输入密码" />
    </div>
    <div class="option">
      <div class="left">
        <!-- <img src="../../../assets/image/user/check-default-ico.png" alt />
        记住我-->
      </div>
      <div class="right" @click="forgetPass">忘记密码</div>
    </div>
    <div class="btn" @click="login">登录</div>
    <div class="hint">
      还没有账号？马上
      <span class="path" @click="skip">立即注册</span>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      addData: {
        phone: "15210176460",
        password: "123456"
      }
    };
  },
  methods: {
    login() {
      this.$axios.post("/doUserLogin", this.addData).then(res => {
        if (res.code == 200) {
          let userInfo = res.data.user_info;
          this.$store.commit("setToken", userInfo.user_token);
          this.close();
          this.$Toast(res.msg);
          setTimeout(() => {
            window.location.reload();
          }, 200);
        } else {
          this.$Toast(res.msg);
        }
      });
    },
    close() {
      let data = {
        userVivew: false,
        showVivew: ""
      };
      this.$store.commit("SET_VIEW", data);
    },
    skip() {
      this.$store.commit("SET_VIEW", { userView: true, showView: "register" });
    },
    forgetPass() {
      this.$store.commit("SET_VIEW", {
        userView: true,
        showView: "forgetPass"
      });
    }
  }
};
</script>

<style lang="less" scoped>
@import "../common/index.less";
.option {
  .left {
    display: flex;
    align-items: center;
    img {
      margin-right: 5px;
    }
  }
}
</style>
